<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>HTML580图片广告代码</title>
	<meta name="keywords" content="ads ads.js jquery.ads.js 图片广告插件"/>
  <meta name="description" content="html580ads html580ads.js 图片广告插件">
	<link href="css/bootstrap.css" rel="stylesheet">
	<link href="css/bootstrap-responsive.css" rel="stylesheet">
	<link href="css/docs.css" rel="stylesheet">
	<link href="js/google-code-prettify/prettify.css" rel="stylesheet">
	<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
	<!--[if lt IE 9]>
	  <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
	<![endif]--> <!-- Le fav and touch icons -->
	<link rel="apple-touch-icon-precomposed" sizes="144x144" href="ico/apple-touch-icon-144-precomposed.png">
	<link rel="apple-touch-icon-precomposed" sizes="114x114" href="ico/apple-touch-icon-114-precomposed.png">
	<link rel="apple-touch-icon-precomposed" sizes="72x72" href="ico/apple-touch-icon-72-precomposed.png">
	<link rel="apple-touch-icon-precomposed" href="ico/apple-touch-icon-57-precomposed.png">
	<link rel="shortcut icon" href="ico/favicon.png">
<style>
/*扩展提示框内的字体样式*/
.pt {
	font-family: "微软雅黑","Microsoft Yahei",Arial,Helvetica,sans-serif,"宋体";
    font-size: 13px;
	color: #515151;
}
</style>
</head>
<body data-spy="scroll" data-target=".bs-docs-sidebar">
	<!-- Navbar -->
	<div class="navbar navbar-inverse navbar-fixed-top">
		<div class="navbar-inner">
			<div class="container">
				<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
					<span class="icon-bar"></span><span class="icon-bar"></span> <span class="icon-bar"></span>
				</button>
				<a class="brand" href="index.html">html580ads</a>
				<div class="nav-collapse collapse">
					<p class="navbar-text pull-right">
					  <a href="http://www.html580.com/" target="_blank">Blog on html580</a>
					</p>
					<ul class="nav">
						<li class="active"><a href="example.html">Examples</a></li>
					</ul>
				</div>
			</div>
		</div>
	</div>
	<div class="container"><!-- Docs nav -->
		<div class="row">
			<div class="span3 bs-docs-sidebar">
				<ul class="nav nav-list bs-docs-sidenav">
					<li><a href="#html580ads-invoke"><i class="icon-chevron-right"></i>1. 调用方式</a></li>
					<li><a href="#html580ads-example"><i class="icon-chevron-right"></i>2. 示例</a></li>
					<li><a href="#html580ads-feedback"><i class="icon-chevron-right"></i>3. <b style="color:red;">问题反馈</b></a></li>
				</ul>
			</div>

			<div class="span9"><!-- Download -->
				<section id="html580ads-invoke">
					<div class="page-header">
						<h4>1. 调用方式</h4>
					</div>
<pre class="prettyprint linenums">
/*最简单调用方式*/
 $(".postcontent").html580Ads();
/*参数调用*/ 
  $(".postcontent").html580Ads({
  	width: 468,              //广告位宽度
    height: 60,              //广告位高度
    minHeight:200,           //图片显示广告最小高度
    opacity:'0.9',           //透明度
    offsetHeight:0,          //广告位相对图片的高度位移量
    offsetWidth:0,           //广告位相对图片的宽度位移量
    adsDom:'#html580_ads',   //广告位结点
    initShow:true            //是否显示
  });
</pre>
				</section>
				
				<section id="html580ads-example">
					<div class="page-header">
						<h4>2.示例</h4>
					</div>
				<div class="postcontent">
				<p><a href="http://www.html580.com" target="_blank"><img src="img/examples/bootstrap-progressbar.jpg"/></a></p>
				<p> </p>
				<p><a href="http://www.html580.com" target="_blank"><img src="img/examples/bootstrap-progressbar.jpg"/></a></p>
				<p> </p>
				<p><a href="http://www.html580.com" target="_blank"><img src="img/examples/bootstrap-progressbar.jpg"/></a></p>
			  </div>
				</section>
				
				<section id="html580ads-feedback">
					<div class="page-header">
						<h4>3. 在“HTML我帮您博客”上和大家讨论反馈</h4>
					</div>
					<div class="bs-docs-example" style="padding-bottom: 24px;">
						这里有朋友：<a href="http://www.html580.com/11372" target="_blank">Blog on html580</a> <br>
					</div>
				</section>

			</div>
		</div>
	</div>
	
	<!-- Footer -->
	<footer class="footer">
		<div class="container">
			Designed and build by <a href="https://github.com/html580" target="_blank">@html580</a>
			<p><a href="http://www.html580.com" target="_blank">Blog on html580</a></p>
		</div>
	</footer>				
	<!-- Placed at the end of the document so the pages load faster -->
	<script src="js/jquery.js"></script>
	<script src="js/bootstrap-transition.js"></script>
	<script src="js/bootstrap-alert.js"></script>
	<script src="js/bootstrap-modal.js"></script>
	<script src="js/bootstrap-dropdown.js"></script>
	<script src="js/bootstrap-scrollspy.js"></script>
	<script src="js/bootstrap-tab.js"></script>
	<script src="js/bootstrap-tooltip.js"></script>
	<script src="js/bootstrap-popover.js"></script>
	<script src="js/bootstrap-button.js"></script>
	<script src="js/bootstrap-collapse.js"></script>
	<script src="js/bootstrap-carousel.js"></script>
	<script src="js/bootstrap-typeahead.js"></script>
	<script src="js/bootstrap-affix.js"></script>
	<script src="js/holder/holder.js"></script>
	<script src="js/google-code-prettify/prettify.js"></script>	
	<script src="js/application.js"></script>	
	<script src="js/html580ads.js"></script>
	<div id="html580_ads" style="width:460px;height:60px;background:#FF0000;text-align:center;color:#ffffff;">
		这里放广告代码，用户可以根据需要修改相应的代码
	</div>
	<script type="text/javascript">
	$(function () {
	        $(".postcontent").html580Ads();
	});
	</script>
</body>
</html>
